.order-detail{
	height: 100vh;
	position: relative;
	background-color: #f2f2f2;
	overflow: hidden;
	.top-bg{
		width:100%;
		height:360rpx;
		position: relative;
		background-color: red;
		&.paying{
			background: url('https://vkceyugu.cdn.bspapp.com/VKCEYUGU-8acfaa58-aeb5-4502-8309-365d4c6cca4a/305c1e23-649f-4b57-9231-09c767700a35.png') no-repeat;
			background-size: 100% 100%;
			&::after{
				background-color: #e82b2b;
			}
			.order-detail-content-container{
					box-shadow:0rpx 2rpx 14rpx rgba(0, 0, 0, 0.08),0px 18rpx 6rpx rgba(233, 60, 60, 0.2) inset;
			}
		}
		&.processed{
			background: url('https://vkceyugu.cdn.bspapp.com/VKCEYUGU-8acfaa58-aeb5-4502-8309-365d4c6cca4a/3e83b5e0-8fc5-486d-b5dd-c20bd2e8840f.png') no-repeat;
			background-size: 100% 100%;
			&::after{
				background-color: #0d7dde;
			}
			.order-detail-content-container{
					box-shadow:0rpx 2rpx 14rpx rgba(0, 0, 0, 0.08),0px 18rpx 6rpx rgba(19,112,193,0.2) inset;
			}
		}
		&.complate{
			background: url('https://vkceyugu.cdn.bspapp.com/VKCEYUGU-8acfaa58-aeb5-4502-8309-365d4c6cca4a/c8ad9819-3362-465c-a26f-735d94178078.png') no-repeat;
			background-size: 100% 100%;
			&::after{
				background-color: #00be58;
			}
			.order-detail-content-container{
					box-shadow:0rpx 2rpx 14rpx rgba(0, 0, 0, 0.08),0px 18rpx 6rpx rgba(13,209,104,0.2) inset;
			}
		}
		&.cancel{
			background: url('https://vkceyugu.cdn.bspapp.com/VKCEYUGU-8acfaa58-aeb5-4502-8309-365d4c6cca4a/82b94d49-6a6e-47da-9096-b1c5d9292887.png') no-repeat;
			background-size: 100% 100%;
			&::after{
				background-color: #0D7DDD;
			}
			.order-detail-content-container{
					box-shadow:0rpx 2rpx 14rpx rgba(0, 0, 0, 0.08),0px 18rpx 6rpx rgba(19,112,193,0.2) inset;
			}
		}
		&.overdue{
			background: url('https://vkceyugu.cdn.bspapp.com/VKCEYUGU-8acfaa58-aeb5-4502-8309-365d4c6cca4a/75893e57-8c04-459d-a9e1-505657e10af7.png') no-repeat;
			background-size: 100% 100%;
			&::after{
				background-color: #e82b2b;
			}
			.order-detail-content-container{
					box-shadow:0rpx 2rpx 14rpx rgba(0, 0, 0, 0.08),0px 18rpx 6rpx rgba(233, 60, 60, 0.2) inset;
			}
		}
		&.vip{
			background: url('https://vkceyugu.cdn.bspapp.com/VKCEYUGU-8acfaa58-aeb5-4502-8309-365d4c6cca4a/02c664e5-af52-4eb4-b5e7-f91cc3cdbfdf.png') no-repeat;
			background-size: 100% 100%;
			&::after{
				background-color: #D28633;
			}
			.order-detail-content-container{
					box-shadow:0rpx 2rpx 14rpx rgba(0, 0, 0, 0.08),0px 18rpx 6rpx rgba(193,116,32,0.2) inset;
			}
		}
		&::after{
			content: "";
			position: absolute;
			left: 50%;
			transform: translateX(-50%);
			top: 246rpx;
			width:722rpx;
			height:46rpx;
			border-radius:26rpx;
			
			z-index: 10;
		}
		.top-title{
			position: absolute;
			top: 66rpx;
			left: 32rpx;
			height:80rpx;
			font-family:$global-font-family;
			font-weight:900;
			color:#ffffff;
			font-size:56rpx;
			// letter-spacing:87px;
			line-height:80rpx;
		}
		.top-prompt{
			position: absolute;
			top: 158rpx;
			left: 32rpx;
			height:32rpx;
			font-family:$global-font-family;
			color:#ffffff;
			font-size:22rpx;
			line-height:32rpx;
		}
		.order-detail-content-container{
			position: relative;
			z-index: 100;
			top: 270rpx;
			left: 50%;
			transform: translateX(-50%);
			width:686rpx;
			height:518rpx;
			background-color:#ffffff;
			border-radius:0rpx 0rpx 24rpx 24rpx;
			padding: 48rpx 72rpx 48rpx 72rpx;
			box-sizing: border-box;
			.goods-info-container{
				height: 132rpx;
				border-bottom: 1rpx #cccccc solid;
				box-sizing: border-box;
				width: 100%;
				display: flex;
				justify-content: space-between;
				.goods-info-left{
					flex: 1;
					overflow: hidden;
					text-overflow: ellipsis;
					white-space: nowrap;
				}
				.goods-info-right{
					width:240rpx;
					height:60rpx;
					font-family:$global-font-family;
					font-weight:900;
					color:#e93c3c;
					font-size:44rpx;
					// text-align: right;
				}
			}
			.order-detail-container{
				margin-top: 48rpx;
			}
			.order-detail-item{
				display: flex;
				align-items: center;
				margin-bottom: 16rpx;
				.order-detail-item-label{
					height:34rpx;
					font-family:$global-font-family;
					color:#999999;
					font-size:24rpx;
					line-height:34rpx;
					margin-right: 52rpx;
				}
				.order-detail-item-value{
					height:34rpx;
					font-family:$global-font-family;
					color:#333333;
					font-size:24rpx;
					line-height:34rpx;
				}
			}
		}
	}
		.order-btn{
			margin: 0 auto;
			width:574rpx;
			height:100rpx;
			border-radius:24rpx;
			margin-top: 612rpx;
			font-family:$global-font-family;
			font-weight:900;
			color:#ffffff;
			font-size:32rpx;
			display: flex;
			align-items: center;
			justify-content: center;
			&::after{
				border: none !important;
				outline: none !important;
			}
			&.paying{
				background-color:#f64747;
			}
			&.complate{
				background-color: #188cf1;
			}
			&.overdue{
				background-color:#f64747;
			}
			&.cancel{
				background-color: #188cf1;
			}
			&.processed{
				background-color: #188cf1;
			}
			&.vip{
				background-color: #188cf1;
			}
		}
}
/deep/ .u-countdown-item{
	background-color: transparent !important;
}